<div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="titlepage">
                        <h2>购物车</h2>
                    </div>
                </div>
            </div>
        </div>
        <div class="brand-bg">
            <div class="container">
				<div class="row">
					<div class="col-md-12 cart-bg">
						<form class="main_form">
							<div class="row">
								<table class="cart-item-list col-md-12">
									<thead>
										<tr>
											<th>序号</th>
											<th>商品图片</th>
											<th>商品名称</th>
											<th>规格</th>
											<th>单价</th>
											<th>数量</th>
											<th>操作</th>
										</tr>
									</thead>
									<tbody>
										<td colspan="7">空空如也</td>
									</tbody>
								</table>
								<div class="cart-button-list col-md-12">
									<div class="total">总价：<span>0.00</span> 元</div>
									<button type="button" class="btn btn-success">结算购物车</button>
									<button type="button" class="btn btn-danger">清空购物车</button>
								</div>
							</div>
						</form>
					</div>
				</div>
            </div>
        </div>
<script>
	$(function (){
		$(".cart-button-list .btn-success").click(function (){
			let url="/ruoyi/order";
			jumphtml(url);
		});
		doGetCarts();
		doCleanCart();
	});
	function doGetCarts(){
		let url = `/ruoyi/cart/getcarts`;
		$.ajax({
			url:url,
			dataType:"json",
			success(result){
				if (result.status===200){
					doLoadCarts(result.data.carts);
					$("#mainContentId").data("cartData",result.data);
					$(".total").children("span").text(result.data.total);
					doClickCat();
				}
			}
		});
	}
	function doLoadCarts(carts){
		let tbody = $(".cart-item-list tbody");
		tbody.empty();
		for (let i=0;i<carts.length;i++) {
			let tr = $("<tr></tr>");
			tr.data("rowData",carts[i]);
			tr.append(doCreateCart(i+1,carts[i]));
			tbody.append(tr);
		}

	}
	function doCreateCart(i,cart){
		return `<td>${i}</td>
				<td><img src="${cart.image}"></td>
				<td>${cart.title}</td>
				<td>${cart.sizeName}</td>
				<td>${cart.price}</td>
				<td><input class="num" type="text" name="number" maxlength="2" onBlur="" value="${cart.num}"/></td>
				<td><a href="javascript:void(0);" class="dodelete">删除</a></td>`;
	}
	function doClickCat(){

		$(".dodelete").click(function (){
			if (confirm("是否删除？")){
				let msg = $(this).parents("tr").data("rowData");
				let params = {"itemId":msg.itemId,"sizeId":msg.sizeId};
				let url = `/ruoyi/cart/deletecart`;
				$.ajax({
					url:url,
					data: params,
					success(result){
						if (result.status===200){
							alert("删除成功!");
							doGetCarts();
						}
					},
					error(){
						alert("删除失败");
					}
				});
			}

		});
		$(".num").change(function (){
			let msg = $(this).parents("tr").data("rowData");
			let newnum = $(this).val();
			let sizeId = msg.sizeId;
			let params = {"itemId":msg.itemId,"num":newnum,"sizeId":sizeId};
			let url = `/ruoyi/cart/changenum`;
			$.ajax({
				url:url,
				data:params,
				success(result){
					if (result.status===200){
						alert("修改成功！");
						doGetCarts();
					}
				},
				error() {
					alert("修改失败");
				}
			});
		});
	}
	function doCleanCart(){
		$(".cart-button-list .btn-danger").click(function (){
			if (confirm("是否清空购物车？")){
				let url = `/ruoyi/cleanCart`;
				$.ajax({
					url:url,
					dataType: "json",
					success(result) {
						if (result.status===200) {
							alert("清除成功!");
							doGetCarts();
							$(".cart-item-list tbody").append(`<td colspan="7">空空如也</td>`);
						}
					},
					error(){
						alert("删除失败");
					}
				});
			}
		});
	}
</script>
